$theme-color: #f15a22;

@tailwind base;
@tailwind components;
@tailwind utilities;

// place your custom styles here
.page-cover {
    padding-top: 20px;
}
.page-cover img {
    object-fit: contain;
    max-height: 600px;
}

.vp-navbar {
    // background-color: rgba(0, 0, 255, 0.1);
}
.vp-brand {
    display: flex;
}
.vp-nav-logo {
    border-radius: 50%;
}
.vp-site-name {
    font-weight: bold;
    color: #f15a22;
    font-size: 24px;
}
.dropdown-title {
    display: flex;
    align-items: center;
}
.vp-blog-type-button .icon-wrapper {
    padding: 4px;
}
.vp-star-article-wrapper .title, .vp-category-wrapper .title, .vp-tag-wrapper .title {
    display: flex;
    align-items: center;
}
.vp-blog-hero-title {
    color: $theme-color;
    font-size: 38px;
}
.vp-blog-hero-description {
    font-weight: bold;
    font-size: 30px;
    color: #cf12d895;
}
.vp-sidebar {
    padding-inline-start: 0;
}